<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
      *{
        margin: 0;
        padding: 0;
      }
      #a{
          width: 100%;
          height: 100vh;
          background-color: #abb2b2;
          display: flex;
          flex-direction: column;
      }
     div header{
         height: 60px;
         background-color: #4a4747;
     }
     div footer{
         height: 60px;
         background-color: #4a4747;
     }
     div main{
         flex: 1;
     }
     .left{
         width: 200px;
         height: 100%;
         background-color: #a0a1a1;
     }
     .realt{
         flex: 1;
         background-color: beige;
     }
    </style>
</head>
<body>
   <div id="a">
       <header></header>
       <main>
           <section class="left"></section>
           <section class="realt"></section>
       </main>
       <footer></footer>
   </div>
</body>
</html>